<script>
import router from '@/router';
// 引入验证账号密码
import { verify } from '@/api/home.js'


export default {
    data() {
        return {
            adminname: "",
            password: "",
            // 申请登录返回的数据
            userData: '',
        };
    },
    computed: {
        // 将全局状态中的数据通过mapState辅助函数映射的方式获取
        all() {
            localStorage.setItem('')
        },

    },
    methods: {
        // 登录事件处理
        submitForm() {




        },
        toLink() {
            console.log('跳转注册页面');
            router.push('register');
        },
        // 登录点击事件
        open() {
            console.log(123);
            // 获取用户名是否正确


            verify({ userid: this.adminname, userpassword: this.password }).then(res => {
                // 将结果赋值给userData
                this.userData = res;
                localStorage.setItem('teacher', this.userData.username)
                localStorage.setItem('OwningRegion', this.userData.OwningRegion);


                // 判断是否账号密码正确
                if (this.userData.code == '200') {
                    // 账号密码正确
                    //  跳转页面
                    router.push('/myHome');
                    // 轻提示
                    ElMessage({ message: '登陆成功', type: 'success' });

                } else {
                    // 账号或密码不正确
                    ElMessage.error('账号或密码错误');
                }
               
            })




        },
    },
    mounted() {
        
    }
};
</script>


<template>
    <div class="login-container">
        <div class="form-wrap">
            <h2 class="header">
                智慧校园登录
            </h2>
            <el-input v-model="adminname" :minlength="6" clearable placeholder="请输入管理员账号" />
            <el-input v-model="password" clearable class="psw" placeholder="请输入管理员密码" type="password" />

            <el-button type="primary" @click="open">登录</el-button>

            <el-button type="primary" @click="toLink" style="margin-top: 6px;margin-left:0px">注册</el-button>


        </div>
    </div>
</template>



<style scoped lang="scss">
.login-container {
    height: 100%;
    background-color: skyblue;
}

.form-wrap {
    position: relative;
    left: 50%;
    top: 50%;
    width: 360px;
    transform: translate(-50%, -50%);
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 5%;
    padding: 32px;
    text-align: center;

    .header {
        margin-bottom: 32px;
    }

    .el-button {
        width: 100%;
    }

    .psw {
        margin-top: 20px;
        margin-bottom: 20px;
    }
}
</style>